<nb-card size="medium">
  <nb-card-body>
    <div class="location">
      <span>New York</span>
    </div>
    <div class="date">
      <span>Mon 29 May</span>
    </div>
    <div class="daily-forecast">
      <div class="info">
        <div class="temperature">
          <span>20&deg;</span>
        </div>
        <div class="icon">
          <i class="ion-ios-sunny-outline"></i>
        </div>
      </div>
      <div class="details">
        <div class="parameter">
          <span class="parameter-name">max</span>
          <span class="parameter-value">23&deg;</span>
        </div>
        <div class="parameter">
          <span class="parameter-name">min</span>
          <span class="parameter-value">19&deg;</span>
        </div>
        <div class="parameter">
          <span class="parameter-name">wind</span>
          <span class="parameter-value">4 km/h</span>
        </div>
        <div class="parameter">
          <span class="parameter-name">hum</span>
          <span class="parameter-value">87%</span>
        </div>
      </div>
    </div>
    <div class="weekly-forecast">
      <div class="day">
        <span class="caption">Sun</span>
        <i class="ion-ios-cloudy-outline"></i>
        <span class="temperature">17&deg;</span>
      </div>
      <div class="day">
        <span class="caption">Mon</span>
        <i class="ion-ios-sunny-outline"></i>
        <span class="temperature">19&deg;</span>
      </div>
      <div class="day">
        <span class="caption">Tue</span>
        <i class="ion-ios-rainy-outline"></i>
        <span class="temperature">22&deg;</span>
      </div>
      <div class="day">
        <span class="caption">Wed</span>
        <i class="ion-ios-partlysunny-outline"></i>
        <span class="temperature">21&deg;</span>
      </div>
    </div>
  </nb-card-body>
</nb-card>
